<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>defineProperty</title>
</head>
<body>

</body>
<script>
    let obj = {
        firstName: "A",
        lastName: "B"
    };


    Object.defineProperty(obj, "fullName", {
//        configurable  //是否可以重新定义(删除)
//        enumerable //是否可枚举
//        value      //默认值
//        writable  //是否可写
        get(){ //回调函数,读取/获取属性
            return this.firstName + "-" + this.lastName
        },
        set(data){ //回调函数 监听属性
//            console.log("data--->", data) // C-D
            let names = data.split("-");   //C-D ===> [C,D]

            //,设置
            this.firstName = names[0];
            this.lastName = names[1]
        }
    });
    console.log("obj.fullName---->",obj.fullName);
    obj.fullName = "C-D";

    console.log("obj---->",obj);

    {
        /*Object.defineProperty(obj, "fullName", {
            configurable: false,
            value: "A-B"
        });*/

        /*Object.defineProperty(obj, "fullName", {
            configurable: false,
            value: "C-D"
        });*/
    }

    {
        Object.defineProperty(obj, "fullName", {
            configurable: false,
            enumerable: true,
            value: "A-B",
            writable: true
        });
        console.log("--------------11111---------------",obj);
        for(let key in obj){
            console.log(key, obj[key])
        }
        obj.fullName = "E-F";

        console.log("--------------222222---------------",obj);
    }

    //订阅发布  观察者

    //Object.defineProperty(obj, prop, descriptor)

    //   descriptor属性描述符

    //        数据描述符
    //        configurable  //是否可以重新定义(删除)
    //        enumerable //是否可枚举
    //        value      //默认值
    //        writable  //是否可写
    //        访问(存取)描述符
    //        get       //回调函数,读取/获取属性
    //        set        //回调函数 监听属性


    //vue2.x  核心 ====> Object.defineProperty
    //   Object.defineProperty -> ES5方法 -> IE8不支持
    ///IE8不支持 ---> vue2.0
</script>
</html>